<template>
  <div class="acManageTop">
    <img src="@/assets/image/logo.png" />
    <span class="leftName">青春有我·</span>
    <slot name="right"> </slot>
    <div class="right">
      <router-link to="/indexPage">
        <a class="rightOut">首页</a>
      </router-link>
      <router-link to="/acManagePage">
        <a class="rightOut">活动管理</a>
      </router-link>
      <router-link to="/growthProfile">
        <a class="rightOut">成长档案</a>
      </router-link>
      <router-link to="/setting">
        <a class="rightOut">设置</a>
      </router-link>
    </div>
  </div>
</template>
<script>
export default {
  components: {}
}
</script>
<style lang="less" scoped>
.acManageTop {
  position: relative;
  background-color: rgba(232, 21, 12, 1);
  height: 10vh;
  line-height: 10vh;
  width: 100%;
  img {
    margin-bottom: -7px;
    margin-top: 7px;
    margin-left: 10px;
    width: 30px;
    height: 30px;
  }
  .leftName {
    font-size: 0.4375rem;
    padding-left: 10px;
    padding-right: 8px;
    color: #fff;
    font-weight: 600;
  }
  .rightName {
    font-size: 0.52rem;
    color: #fbb40a;
  }
  .right {
    position: absolute;
    top: 5px;
    right: 10px;
    a {
      text-decoration: none;
      font-size: 14px;
      padding-right: 8px;
      color: #fff;
    }
    a:hover {
      color: #ff8c00;
    }
  }
}
</style>
